$distance-to-edge: 15px;

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #eee;
  margin: 1em 0;
  padding: 0;
}

.calendar {
  width: 805px;
  position: absolute;
  margin: 0 auto;
  bottom: $distance-to-edge;
  right: 0;
  left: 155px;
  padding: 6px;
  background-color: #fff;
  border: solid 1px #eee;
  border-radius: 3px;
  transition: 0.3s;

  &.calendar-pushed {
    left: 310px; // 505 - (250 / 2)
  }
}

.cg-day {
  &:hover {
    cursor: pointer;
  };
}

// for calender hover
#tooltip {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  height: 23px;
  background-color: rgba(0, 0, 0, 0.8);
  color: #fff;
  padding: 4px 10px;
  border-radius: 3px;
  z-index: 1;
}

#tooltip:after {
  display: block;
  position: absolute;
  content: '';
  bottom: -6px;
  left: 50%;
  margin-left: -6px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid rgba(0, 0, 0, 0.8);
}


.textarea {
  resize: none;
  background: transparent;
  font-size: 15px;
  position: fixed;
  top: 50px;
  right: $distance-to-edge;
  width: 280px;
  height: 70%;
  border: 0px solid #eee;
  border-radius: 3px;
  outline: 0;
  // padding: 5px;
  color: #555;
  background-attachment:local;
  // ref; https://css-tricks.com/fun-line-height/
  line-height: 30px; // 注意行高要和背景图高度一致resize: none;
  background: repeating-linear-gradient(transparent, transparent 1px, transparent 29px, rgba(221, 221, 221, 0.8) 30px) repeat;

  &::placeholder {
    color: rgba(221, 221, 221, 1);
    text-align: left;
  }
}

.setting-ico {
  display: inline;
  width: 1em;
  height: 1em;
}
